

<div>
<p-table #dtl [columns]="cols1" [value]="outRecords" [paginator]="true" [rows]="10">
  <ng-template pTemplate="caption">
    其他人的外出记录
    <div style="text-align: right">
      <i class="fa fa-search" style="margin: 20px 4px 0 0"></i>
      <input type="text" pInputText size="50" placeholder="Global Filter" (input)="dtl.filterGlobal($event.target.value, 'contains')" style="width: auto">
    </div>
  </ng-template>
  <ng-template pTemplate="header" let-columns>
    <tr>
      <th *ngFor="let col of columns" [pSortableColumn]="col.field">
        {{col.header}}
        <p-sortIcon [field]="col.field"></p-sortIcon>
      </th>
    </tr>
    <tr>
      <th *ngFor="let col of columns" [ngSwitch]="col.field">
        <input *ngSwitchCase="'admin_id'" pInputText type="text" (input)="dtl.filter($event.target.value, col.field, col.filterMatchMode)">
        <input *ngSwitchCase="'satrt_time'" pInputText type="text" (input)="dtl.filter($event.target.value, col.field, col.filterMatchMode)">
        <input *ngSwitchCase="'end_time'" pInputText type="text" (input)="dtl.filter($event.target.value, col.field, col.filterMatchMode)">
        <input *ngSwitchCase="'days'" pInputText type="text" (input)="dtl.filter($event.target.value, col.field, col.filterMatchMode)">
        <input *ngSwitchCase="'reason'" pInputText type="text" (input)="dtl.filter($event.target.value, col.field, col.filterMatchMode)">
      </th>
    </tr>
  </ng-template>
  <ng-template pTemplate="body" let-rowData let-columns="columns">
    <tr [pSelectableRow]="rowData">
      <td *ngFor="let col of columns">
        {{rowData[col.field]}}
      </td>
    </tr>
  </ng-template>
</p-table>
</div>

<br>
<br>

<div>
<p-table #dtl [columns]="cols2" [value]="leaveRecords" [paginator]="true" [rows]="10">
  <ng-template pTemplate="caption">
    其他人的请假记录
    <div style="text-align: right">
      <i class="fa fa-search" style="margin: 20px 4px 0 0"></i>
      <input type="text" pInputText size="50" placeholder="Global Filter" (input)="dtl.filterGlobal($event.target.value, 'contains')" style="width: auto">
    </div>
  </ng-template>
  <ng-template pTemplate="header" let-columns>
    <tr>
      <th *ngFor="let col of columns" [pSortableColumn]="col.field">
        {{col.header}}
        <p-sortIcon [field]="col.field"></p-sortIcon>
      </th>
    </tr>
    <tr>
      <th *ngFor="let col of columns" [ngSwitch]="col.field">
        <input *ngSwitchCase="'admin_id'" pInputText type="text" (input)="dtl.filter($event.target.value, col.field, col.filterMatchMode)">
        <input *ngSwitchCase="'satrt_time'" pInputText type="text" (input)="dtl.filter($event.target.value, col.field, col.filterMatchMode)">
        <input *ngSwitchCase="'end_time'" pInputText type="text" (input)="dtl.filter($event.target.value, col.field, col.filterMatchMode)">
        <input *ngSwitchCase="'days'" pInputText type="text" (input)="dtl.filter($event.target.value, col.field, col.filterMatchMode)">
        <input *ngSwitchCase="'reason'" pInputText type="text" (input)="dtl.filter($event.target.value, col.field, col.filterMatchMode)">
        <input *ngSwitchCase="'type_name'" pInputText type="text" (input)="dtl.filter($event.target.value, col.field, col.filterMatchMode)">
      </th>
    </tr>
  </ng-template>
  <ng-template pTemplate="body" let-rowData let-columns="columns">
    <tr [pSelectableRow]="rowData">
      <td *ngFor="let col of columns">
        {{rowData[col.field]}}
      </td>
    </tr>
  </ng-template>
</p-table>
</div>
